@extends('layout.app')
@section('title','Центры')
@section('content')
    <div class="flex justify-between items-center">

        <h1 class="text-[#232323] text-[40px] font-medium">Список центров</h1>
        <div class="flex gap-[10px]">

{{--            <button type="button" id="export_button"--}}
{{--                    class="flex gap-[10px] bg-[#EB692C] text-white rounded-[5px] p-[15px] inline-block">--}}
{{--                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="21" viewBox="0 0 20 21" fill="none">--}}
{{--                    <path d="M12.5 12.1667L16.6667 8.00004L12.5 3.83337" stroke="white" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>--}}
{{--                    <path d="M3.33398 17.1667V11.3333C3.33398 10.4493 3.68517 9.60143 4.31029 8.97631C4.93542 8.35119 5.78326 8 6.66732 8H16.6673" stroke="white" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>--}}
{{--                </svg>--}}
{{--                <span>--}}
{{--                    Экспортировать--}}
{{--                </span>--}}
{{--            </button>--}}
        </div>
    </div>
    <table class="w-full my-[50px]" id="export_table">
        <tbody>
        <tr class="result-top">
            <th class="result-top__item">Номер</th>
            <th class="result-top__item">Название</th>
            <th class="result-top__item">Телефон</th>
            <th class="result-top__item">Сайт</th>
            <th class="result-top__item">Адрес</th>
            <th class="result-top__item">Небольшое описание</th>
            <th class="result-top__item">Действие</th>
        </tr>
        @foreach ($centers as $key => $center)

            <tr class="result-bottom">
                <td class="">{{$key + 1}}</td>
                <td class="">{{ $center->name }}</td>
                <td class=""> {{ $center->phone }}</td>
                <td class=""> {{ $center->site }}</td>
                <td class="">{{  $center->address }}</td>
                <td class="">{{ $center->notation }}</td>

                <td class="">
                    <div class="flex items-center justify-center">
                        <a href="{{ route('centers.edit', $center->id)  }}" class="p-2">
                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                <g opacity="0.3">
                                    <path fill-rule="evenodd" clip-rule="evenodd" d="M2.79081 4.79081C3.29716 4.28446 3.98392 4 4.7 4H11C11.4971 4 11.9 4.40294 11.9 4.9C11.9 5.39706 11.4971 5.8 11 5.8H4.7C4.4613 5.8 4.23239 5.89482 4.0636 6.0636C3.89482 6.23239 3.8 6.4613 3.8 6.7V19.3C3.8 19.5387 3.89482 19.7676 4.0636 19.9364C4.23239 20.1052 4.46131 20.2 4.7 20.2H17.3C17.5387 20.2 17.7676 20.1052 17.9364 19.9364C18.1052 19.7676 18.2 19.5387 18.2 19.3V13C18.2 12.5029 18.6029 12.1 19.1 12.1C19.5971 12.1 20 12.5029 20 13V19.3C20 20.0161 19.7155 20.7028 19.2092 21.2092C18.7028 21.7155 18.0161 22 17.3 22H4.7C3.98392 22 3.29716 21.7155 2.79081 21.2092C2.28446 20.7028 2 20.0161 2 19.3V6.7C2 5.98392 2.28446 5.29716 2.79081 4.79081Z" fill="black"/>
                                    <path fill-rule="evenodd" clip-rule="evenodd" d="M19.2894 3.73683C19.0311 3.73683 18.7835 3.83942 18.6008 4.02204L10.521 12.1019L10.062 13.938L11.8981 13.479L19.978 5.39916C20.1606 5.21654 20.2632 4.96886 20.2632 4.7106C20.2632 4.45234 20.1606 4.20466 19.978 4.02204C19.7953 3.83942 19.5477 3.73683 19.2894 3.73683ZM17.3727 2.79392C17.8811 2.28558 18.5705 2 19.2894 2C20.0083 2 20.6977 2.28558 21.2061 2.79392C21.7144 3.30225 22 3.9917 22 4.7106C22 5.42949 21.7144 6.11895 21.2061 6.62728L12.9562 14.8772C12.8449 14.9885 12.7054 15.0675 12.5527 15.1056L9.07905 15.9741C8.78312 16.048 8.47007 15.9613 8.25437 15.7456C8.03867 15.5299 7.95196 15.2169 8.02595 14.9209L8.89436 11.4473C8.93254 11.2946 9.01149 11.1551 9.12279 11.0439L17.3727 2.79392Z" fill="black"/>
                                </g>
                            </svg>

                        </a>
                    </div>


                </td>

            </tr>
        @endforeach


        </tbody></table>


@endsection
